<%--
  Created by IntelliJ IDEA.
  User: ylq
  Date: 2017/6/13
  Time: 17:08
  To change this template use File | Settings | File Templates.
--%>
<link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/userinfo/updatepwd.css"/>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%--<div class="container">--%>
<%--<div class="row main">--%>
<%--<div class="panel-heading">--%>
<%--<div class="panel-title text-center">--%>
<%--<h1 class="title"></h1>--%>
<%--<hr/>--%>
<%--</div>--%>
<%--</div>--%>
<%--<div class="main-login main-center">--%>
<%--<form class="form-horizontal" id="updatepwdForm">--%>
<%--<div class="form-group">--%>
<%--<label for="registermail" class="cols-sm-2 control-label">注册邮箱</label>--%>
<%--<div class="cols-sm-10">--%>
<%--<div class="input-group">--%>
<%--<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>--%>
<%--<input type="text" class="form-control" name="registermail" id="registermail"--%>
<%--placeholder="请输入您的注册邮箱"/>--%>
<%--<button class="orderlist-cancelorder-btn" id="getcapchacode">--%>
<%--获取验证码--%>
<%--</button>--%>
<%--</div>--%>
<%--</div>--%>
<%--</div>--%>

<%--<div class="form-group">--%>
<%--<label for="capchacode" class="cols-sm-2 control-label">验证码</label>--%>
<%--<div class="cols-sm-10">--%>
<%--<div class="input-group">--%>
<%--<span class="input-group-addon"><i class="fa fa-lock fa-lg" aria-hidden="true"></i></span>--%>
<%--<input type="text" class="form-control" name="capchacode" id="capchacode"--%>
<%--placeholder="请输入验证码"/>--%>
<%--</div>--%>
<%--</div>--%>
<%--</div>--%>

<%--</form>--%>
<%--<div class="form-group ">--%>
<%--<button type="button" id="resetpwd" class="btn btn-primary btn-lg btn-block login-button"--%>
<%--data-href="${pageContext.request.contextPath}/retrievepwd/resetpwd">确定--%>
<%--</button>--%>
<%--</div>--%>
<%--</div>--%>
<%--</div>--%>
<%--</div>--%>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <!-- 上述3个meta标签*必须*放在最前面，任何其他内容都*必须*跟随其后！ -->
    <title>Bootstrap 101 Template</title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link href="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
    <!-- 可选的Bootstrap主题文件（一般不用引入） -->
    <link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/css/bootstrap-theme.min.css">
    <link rel="stylesheet" type="text/css" href="${pageContext.request.contextPath}/css/login.css"/>

    <link href="css/retrievePasswd.css" rel="stylesheet">
    <!--[if lte IE 9]>

    <script src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/respond.min.js"></script>
    <script src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/html5shiv.min.js"></script>
    <![endif]-->
    <script src="${pageContext.request.contextPath}/js/encrypt.js"></script>
</head>
<body>
<div class="panel-body">
    <p><strong style="text-decoration: underline;">重设密码</strong></p>

    <div class="row">
        <div class="col-sm-1 col-md-2"></div>
        <div class="col-sm-10 col-md-8" id="content">

            <!-- 注册流程 -->
            <div id="retrieve-flow">
                <div class="flow">
                    <div class="active" id="flow-1">
                        <div class="circle">1</div>
                        <span>验证身份</span></div>
                    <div id="flow-2">
                        <div class="circle">2</div>
                        <span>重设新密码</span></div>
                    <div id="flow-3">
                        <div class="circle">3</div>
                        <span>完成</span></div>
                    <p></p>
                </div>

                <div class="panel-body">
                    <form class="form-horizontal" method="post" id="retrieve-form"
                          data-href="${pageContext.request.contextPath}/retrievepwd/resetPasswd">

                        <div id="form-1">
                            <div class="form-group">
                                <label for="loginId" class="col-sm-4 control-label">用户名<span
                                        style="color: red">&nbsp;*</span></label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" id="loginId" name="loginId" value=""
                                           onBlur="window.validate.valid(this,['require','loginId'],[{},{url:'${pageContext.request.contextPath}/retrievepwd/validLoginId', id:'loginId'}])">
                                </div>
                                <div class="col-sm-4 msg">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="regEmail" class="col-sm-4 control-label">注册邮箱<span style="color: red">&nbsp;*</span></label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" id="regEmail" name="regEmail" value=""
                                           onBlur="window.validate.valid(this,['require','regEmail'],[{},{url:'${pageContext.request.contextPath}/retrievepwd/validRegEmail', id:'loginId'}])">
                                </div>
                                <div class="col-sm-4 msg">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="emailCode" class="col-sm-4 control-label">邮箱验证码<span style="color: red">&nbsp;*</span></label>
                                <div class="col-sm-4">
                                    <input type="text" class="form-control" id="emailCode" name="emailCode" value=""
                                           style="width: 48%;display: inline-block;"
                                           onBlur="window.validate.valid(this,['require','emailCode'],[{},{url:'${pageContext.request.contextPath}/retrievepwd/validSmsCode', id:'regEmail'}])">
                                    <span class="identifying-code" id="send-code"
                                          data-url="${pageContext.request.contextPath}/retrievepwd/identifyingCode">点击获取</span>
                                </div>
                                <div class="col-sm-4 msg">
                                </div>
                            </div>
                            <br>
                            <h4 class="text-center" id="sms-code-msg"></h4>
                            <br>
                        </div>

                        <div id="form-2" style="display: none;">
                            <div class="form-group">
                                <label for="asspwd" class="col-sm-4 control-label">登录密码<span
                                        style="color: red">&nbsp;*</span></label>
                                <div class="col-sm-4">
                                    <input type="password" class="form-control" id="asspwd" name="asspwd"
                                           autocomplete="off"
                                           onBlur="window.validate.valid(this,['require','passwd'],[{},{}])">
                                </div>
                                <div class="col-sm-4 msg">
                                </div>
                            </div>
                            <div class="form-group">
                                <label for="reasspwd" class="col-sm-4 control-label">确认密码<span style="color: red">&nbsp;*</span></label>
                                <div class="col-sm-4">
                                    <input type="password" class="form-control" id="reasspwd" name="reasspwd"
                                           autocomplete="off"
                                           onBlur="window.validate.valid(this,['require','passwd','repasswd'],[{},{},{id:'asspwd'}])">
                                </div>
                                <div class="col-sm-4 msg">
                                </div>
                            </div>
                            <br><h4 class="text-center" id="form-msg"></h4><br>
                        </div>


                        <div id="form-3" style="display: none;">
                            <h2 class="text-center"><img alt="" src="img/success.png">恭喜密码重设成功！</h2><br>
                        </div>

                    </form>

                    <div id="flow-option">
                        <button type="button" id="previous" style="display: none;">上一步</button>
                        <button type="button" class="active" id="next">下一步</button>
                        <button type="button" class="active" id="sure" style="display: none;"
                                data-href="${pageContext.request.contextPath}/login">确定
                        </button>
                    </div>
                </div>

            </div>
        </div>
        <div class=" col-sm-1 col-md-2"></div>
    </div>

</div>
<!-- Modal 通用提示消息模态框-->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog"
     aria-labelledby="myModalLabel">
    <div class="modal-dialog modal-sm" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-label="Close">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title" id="myModalLabel" style="text-align:center;"></h4>
            </div>
            <div class="modal-body"></div>
        </div>
    </div>
</div>
<script src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/jquery.min.js"></script>
<script src="${pageContext.request.contextPath}/bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script src="${pageContext.request.contextPath}/js/retrievepwd/retrievePasswd.js">
</script>
</body>